<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
    <head th:fragment="head-fragment">
        <meta charset="utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <title th:text="${configurations.get('websiteName')} +' | '+ ${pageName}"></title>
        <meta name="description" th:content="${configurations.get('websiteDescription')}">
        <link rel="shortcut icon" th:href="@{${configurations.get('websiteIcon')}}"/>
        <script th:src="@{/blog/plugins/jquery/jquery.min.js}"></script>

        <!-- Third-Party CSS -->
        <link rel="stylesheet" th:href="@{/blog/plugins/bootstrap/bootstrap.min.css}">
        <link rel="stylesheet" th:href="@{/blog/plugins/octicons/octicons.css}">
        <link rel="stylesheet" th:href="@{/blog/plugins/hover/hover-min.css}">
        <link rel="stylesheet" th:href="@{/blog/plugins/primer-markdown/user-content.min.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/syntax.css}">
        <link rel="stylesheet" th:href="@{/blog/plugins/pagination/pagination.css}">
        <!-- My CSS -->
        <link rel="stylesheet" th:href="@{/blog/luna/css/amaze.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/common.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/index.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/about.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/blog-page.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/open-source.css}">
        <link rel="stylesheet" th:href="@{/blog/luna/css/sidebar-popular-repo.css}">

        <script th:src="@{/blog/plugins/pagination/jquery.pagination.js}"></script>
        <script th:src="@{/blog/plugins/bootstrap/bootstrap.min.js}"></script>
    </head>

    <header class="site-header" th:fragment="header-fragment">
        <div class="container">
            <a id="site-header-brand" href="/" title="personal blog">
                <span class="octicon octicon-rocket" th:text="| ${configurations.get('websiteName')}|"></span>
            </a>
            <nav class="site-header-nav" role="navigation">
                <a th:href="@{/index}" class=" site-header-nav-item hvr-underline-from-center">
                    Home
                </a>
                <a th:href="@{/categories}" class=" site-header-nav-item hvr-underline-from-center">
                    Categories
                </a>
                <a th:href="@{/link}" class=" site-header-nav-item hvr-underline-from-center">
                    Links
                </a>
                <a th:href="@{/about}" class=" site-header-nav-item hvr-underline-from-center">
                    About
                </a>
                <a href="https://github.com/mlwhaouqs" class=" site-header-nav-item hvr-underline-from-center"
                   target="_blank">
                    GitHub
                </a>
            </nav>
        </div>
    </header>
</html>

